<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<table id="key" border="1" cellspacing="0" cellpadding="10px">
			<tr>
				<th></th>
				<th>姓名</th>
				<th>性别</th>
				<th>年龄</th>
				<th>家庭地址</th>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>张三</td>
				<td class="sex">男</td>
				<td>18</td>
				<td>福建省</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>李四</td>
				<td class="sex">女</td>
				<td>20</td>
				<td>福建省</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>王五</td>
				<td class="sex">女</td>
				<td>18</td>
				<td>福建省</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>赵六</td>
				<td class="sex">男</td>
				<td>18</td>
				<td>福建省</td>
			</tr>
			<tr>
				<td><input type="checkbox" name="" id="" value="" /></td>
				<td>马七</td>
				<td class="sex">女</td>
				<td>18</td>
				<td>福建省</td>
			</tr>
		</table>
		<input onclick="quanx();" type="checkbox" name="" id="checkall" value="" />全选
		<input onclick="qx_nan();" type="checkbox" name="" id="checknan" value="" />全选男
		<input onclick="qx_nv();" type="checkbox" name="" id="checknv" value="" />全选女
	</body>
	<script type="text/javascript">
		function quanx(){
			var key= document.getElementById('key');
			var key_over= key.getElementsByTagName('input');
			// console.log(key_over);
			var checkvalue=document.getElementById('checkall').checked;
			// console.log(checkvalue);
			for (var i = 0; i < key_over.length; i++) {
				key_over[i].checked=checkvalue;
			}
		}
		function qx_nan(){
			var all_sex=document.getElementsByClassName('sex');
			for (var i = 0; i < all_sex.length; i++) {
				if (all_sex[i].innerText=='男') {
					var key= document.getElementById('key');
					var key_over= key.getElementsByTagName('input');
					var checkvalue=document.getElementById('checknan').checked;
					key_over[i].checked=checkvalue;
				} 
			}
		}
		function qx_nv(){
			var all_sex=document.getElementsByClassName('sex');
			for (var i = 0; i < all_sex.length; i++) {
				if (all_sex[i].innerText=='女') {
					var key= document.getElementById('key');
					var key_over= key.getElementsByTagName('input');
					var checkvalue=document.getElementById('checknv').checked;
					key_over[i].checked=checkvalue;
				} 
			}
		}
	</script>
</html>
